<!-- 页面模板部分 -->
<template>
  <!-- <div class="appbox" @click="editmsgFn">根组件--{{ msg }}</div> -->
  <div class="appbox">
    <!-- <Home></Home> -->
    <!-- 使用分类组件 -->
    <!-- <Category></Category> -->
    <!-- 使用购物车组件 -->
    <!-- <Car></Car> -->
    <!-- 使用计算属性组件 -->
    <!-- <Homeview></Homeview> -->
    <!-- <Categoryview></Categoryview> -->
    <!-- <Carview></Carview> -->
    <!-- <Mineview></Mineview> -->
    <!-- 侦听器组件 -->
    <!-- <Watchview></Watchview> -->
    <!-- <Categorywatch></Categorywatch> -->
    <!-- <Carwatch></Carwatch> -->
    <!-- <Minewatch></Minewatch> -->
    <!-- <Detailwatch></Detailwatch> -->
    <!-- <button @click="flag = !flag">是否显示Homelife组件 </button>
    <Homelife v-if="flag"></Homelife> -->

    <!-- 组件知识点部分 -->
    <!-- <Fathercom></Fathercom> -->
    <Father></Father>
  </div>
</template>
<script>
// 引入首页组件
import Home from './views/directives/Home.vue'
// 引入分类组件
import Category from './views/directives/Category.vue';
// 引入购物车组件
import Car from './views/directives/Car.vue';
// 引入计算属性组件
import Homeview from './views/computed/Homeview.vue';
// 引入计算属性组件cateforyview
import Categoryview from './views/computed/Categoryview.vue';
import Carview from './views/computed/Carview.vue';
import Mineview from './views/computed/Mineview.vue';
// 引入watch监听器页面组件
import Watchview from './views/watch/Homewatch.vue';
import Categorywatch from './views/watch/Categorywatch.vue';
import Carwatch from './views/watch/Carwatch.vue';
import Minewatch from './views/watch/Minewatch.vue';
import Detailwatch from './views/watch/Detail.vue'
// 组件的生命周期
import Homelife from './views/lifecycle/Homelife.vue';

// 组件化开发
import Fathercom from './views/mycomponent/Fathercom.vue';
// 组件通信
//import Father from './views/component-tongxin/father-to-son-1/Father.vue'
// import Father from './views/component-tongxin/father-to-son-2/Father.vue';
// import Father from './views/component-tongxin/father-to-son-3/Father.vue';
// import Father from './views/component-tongxin/son-to-father-2/Father.vue';

import Father from './views/xiushifu/Father3.vue';

// 当前页面的js 部分
export default {
  name: 'App',
  data() {
    return {
      msg: '单身快乐',
      flag: true,
    }
  },
  methods: {
    editmsgFn() {
      this.msg = '下一个节日继续'
    }
  },
  components: {
    Home,
    Category,
    Car,
    Homeview,
    Categoryview,
    Carview,
    Mineview,
    Watchview,
    Categorywatch,
    Carwatch,
    Minewatch,
    Detailwatch,
    Homelife,
    Fathercom,
    Father
  }
}

</script>

<style scoped>
/* 当前页面 组件的css 部分 */
/* .appbox {
  background-color: red;
} */
</style>
